.components-Musicing{
    // display: none;
    opacity: 0;
    // height: 60px;
    // width: 60px;
    height: 100vh;
    width: 100vw;
    position: fixed;
    // bottom: 20px;
    // left: 20px;
    bottom:0;
    left:0;
    background: black;
    transition-duration: .5s;
    z-index:999;
    transform: translateY(110%);
    // border-radius: 50%;
    overflow: hidden;
    .components-Musicing-bg{
        filter: blur(30px);
        background-position: 50%;
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        transform: scale(1.5);
        width: 100%;
    height: 100%;
    }
    .components-Musicing-bg::after{
        content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background-color: rgba(0,0,0,.25)!important;
    }
    .detail-head{
        position: absolute;
        left: 0;
        top: 0;
        height: 8vh;
        width: 100%;
        box-sizing: border-box;
        z-index: 1;
        padding: 20px 40px;
        display: flex;
        color: white;
        font-size: 30px;
        border-bottom: 1px solid pink;
        div:nth-child(2) {
          margin-left:40px;
          span:nth-child(2) {
            font-size: 14px;
            margin-top:5px;
            color: hsla(0,0%,100%,.4)
          }
        }
    }
    .components-Musicing-main{
        position: absolute;
        left: 0;
        top: 8vh;
        width: 100%;
        .components-Musicing-main-needle{
            position: absolute;
            top:-10px;
            left: 0;
            right: 0;
            margin: auto;
            height: 245px;
            width: 146px;
            background:url('../../assets/img/needle-ab.png') no-repeat center;
            background-size: contain;
            transition: all .3s;
            z-index: 999;
            transform: translate3d(50%,0,0) rotate(-30deg);
            transform-origin: 21px 21px
            
        }
        .open-needle{
            transform: translate3d(50%,0,0) rotate(0);
        }
        .components-Musicing-main-disc{
            position: absolute;
            top:140px;
            left: 0;
            right: 0;
            margin: auto;
            animation: rotate 6s linear infinite;
            height: 600px;
            width: 600px;
            .components-Musicing-main-disc-bg{
                // background: url('../../assets/img/disc.efb9e709.png') no-repeat center;
                width: 100%;
                height: 100%;
                position: absolute;
                z-index: 99;
                border-radius: 50%;
                background: hsla(0,0%,100%,.1);
                background-image: url('../../assets/img/disc.efb9e709.png');
                background-position: 50%;
                background-size: contain;
                background-repeat: no-repeat;
            }
            img{
                width: 100%;
                height: 100%;
                position: absolute;
                transform: scale(.69);
            }
        }
        .stop-animation{
            animation-play-state: paused
        }
    }
    .components-Musicing-playlrc{
        height: 15vh;
        position: absolute;
        top:760px;
        width: 100%;
        left:0;
        overflow: hidden;
        color:white;
        .components-Musicing-playlrc-ul{
        //    transition: all 1s;
            .components-Musicing-playlrc-li{
                height: 50px;
                line-height: 50px;
            }
        }

    }
    .components-Musicing-play{
        color: white;
        position: absolute;
        width: 100%;
        box-sizing: border-box;
        bottom:5vh;
        left:0;
        padding: 0 20px;
        .components-Musicing-play-Slider{
            padding: 10px 0 20px 0;
        }
        .am-slider-wrapper{
            flex:1
        }
        .iconfont-Manipulator{
            // font-size: 20px;
            // margin-top:10px;
            .iconfont-Manipulator-play{
                span{
                    font-size: 80px;
                }
                .play{
                    font-size: 120px;
                    margin: 0 40px
                }
            }
            .playlist, .playlis-type{
                font-size: 50px;
            }
        }
    }
}
@keyframes rotate{
	0%{
		transform: rotateZ(0deg);/*从0度开始*/
	}
	100%{
		transform: rotateZ(360deg);/*360度结束*/
	}
}
.components-Musicing-X{
    // display: block;
    border-radius: 0;
    opacity: 1;
    bottom: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    transform: translateX(0)!important;
}
.lycIndex{
    color:rgb(229, 71, 60);
    font-size: 30px;
}